{% extends 'IcsocUIBundle::page.html.twig' %}
{% from 'IcsocUIBundle:Macro:actions.html.twig' import button %}

{% block stylesheet %}
    {{ parent() }}
    {% stylesheets
    '@jqgird_css'
    '@jquery_ui_css'
    '@gritter_css'
    filter='cssrewrite' filter='uglifycss'
    %}
    <link rel="stylesheet" href="{{ asset_url }}" />
    {% endstylesheets %}
{% endblock %}

{% block content %}
            <h3 class="header smaller lighter green">API开发接口配置：</h3>
            <p></p>

            <div class="well">API功能是为了给使用云服务的企业或公司组织提供更强大的第三方自定义扩展，<br>
                企业用户可以使用云客服平台提供的标准JSON接口进行二次开发可以达到规范的数据交互，系统整合，数据调用和数据获取等。
            </div>
            <div class="row" style="margin-bottom: 10px;margin-right: 0">
                <div class="col-sm-12">
                    <small class="muted smaller-90 col-sm-1">API接口功能:</small>
                    <input type="checkbox" class="ace ace-switch ace-switch-5" id="id-button-borders" value="{{ openApi }}" {% if openApi == 1 %}checked="checked"{% endif %} onclick="oneortwo()">
                    <span class="lbl middle"></span>
                </div>
            </div>

            <div class="row" style="margin-bottom: 20px;margin-right: 0">
                 <div class="col-sm-12">
                    <small class="muted smaller-90 col-sm-1" style="line-height:30px">密&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;匙:</small>
                    <span class=" align-middle">
                        <input type="text" style="width:265px" readonly="readonly" value="{{ remotePassword }}" id="pass" class="search-query">
                    </span>
                    <a class="green fa fa-refresh" id="replaceBtn" data-toggle="modal" role="button" href="#modal-table" style="font-size: 20px" onclick="editgroup()"> 更换 </a>
                </div>
            </div>
            <div class="well" style="line-height: 30px">
                <div>坐席注册服务器地址: socket.icsoc.net</div>
                <div>VOIP 电话注册地址 : phone.icsoc.net:5091</div>
                <div>API  接 口 文 档: <a href="http://dev.icsoc.net" target="_blank">http://dev.icsoc.net</a></div>
            </div>

    <div id="dialog-confirm" class="hide row form-horizontal page-content">
        <div class="form-group">
            <label class="col-xs-2 col-sm-4">管理员密码</label>
            <input type="password" id="groupname" value="" class="col-xs-10 col-sm-9" style="width: auto" maxlength="20" />
        </div>
        <div class="hide row" id="remark-confirm" style="text-align: center;margin-top: 2px">
            <span id="prompt" style="color: red"></span>
        </div>
        <div class="form-group" style="text-align: center">
            <button id="remark-btns" type="button" onclick="" class="btn btn-success btn-sm" data-loading-text="Loading...">
                确认
            </button>
        </div>
    </div>
{% endblock %}

{% block footer %}
    {% javascripts
    '@jqgird_js'
    '@gritter_js'
    '@jquery_ui_js'
    '@common_js'
    filter='uglifyjs'
    %}
<script src="{{ asset_url }}"></script>
{% endjavascripts %}
<script type="text/javascript">
    var rowId = 0;
    function editgroup(){
        var yesNoVal = $('#id-button-borders').val();
        if(yesNoVal == 2) {
            remind('gritter-error','未开启API接口功能');
            return;
        }
        $('#id-button-borders').attr('disabled',true);
        $('input[name="radioName"]:checked').val();
        $("#lui_grid-table").remove();
        var rowData = $("#grid-table").jqGrid('getRowData',rowId);
        $('#groupname').val(rowData.group_name);
        $( "#dialog-confirm" ).removeClass('hide').dialog({
            resizable: false,
            modal: false,
            title_html: true,
            height:150,
            width:350,
            title: "请输入管理员密码",
            close: function() {
                $('#id-button-borders').attr('disabled',false);
            }
        });
        $('#remark-btns').attr('onclick',"pass_submit('pass')");
    }
    function pass_submit(work) {
        var pass = $('#groupname').val();
        if(pass == ''){
            remind('gritter-error', '密码不能为空！');
            return;
        }
        var v = $('#id-button-borders').val();
        $.ajax({
            url: "{{ path('icsoc_security_developers_validation') }}",
            dataType: 'json',
            data: {work:work,pass:pass,api:v},
            type: 'post',
            success: function (e) {
                if(e['error'] == 0){
                    $('#dialog-confirm').dialog('close');
                    $('#pass').val(e['message']);
                    remind('gritter-success','更新成功');
                }else if(e['error'] == 2){
                    $('#id-button-borders').attr('disabled',true);
                    checkboxVal();
                    $('#dialog-confirm').dialog('close');
                    $('#id-button-borders').attr('disabled',false);
                    remind('gritter-success','更新成功');
                }else{
                    remind('gritter-error', e['message']);
                }
            }
        })
    }
    function oneortwo(){
        checkboxVal();
        $('input[name="radioName"]:checked').val();
        $("#lui_grid-table").remove();
        var rowData = $("#grid-table").jqGrid('getRowData',rowId);
        $('#groupname').val(rowData.group_name);
        $( "#dialog-confirm" ).removeClass('hide').dialog({
            resizable: false,
            modal: false,
            closeAfterAdd: true,
            closeAfterEdit:true,
            title_html: true,
            height:150,
            width:350,
            title: "请输入管理员密码",
            close: function() {
                $('#id-button-borders').attr('onclick','');
                $("#id-button-borders").trigger("click");
                checkboxVal();
                $("#id-button-borders").attr('onclick',"oneortwo('api')");
                $('#id-button-borders').attr('disabled',false);
            }
        });
        $('#remark-btns').attr('onclick',"pass_submit('api')");
    }

    function checkboxVal(){
        var v = $('#id-button-borders').val();
        if(v == '1'){
            $('#id-button-borders').val('2');
        }else{
            $('#id-button-borders').val('1');
        }
    }

    function remind(a,b) {
        $.gritter.add({
            title: '提醒',
            text: b,
            sticky: false,
            time: 1000,
            speed:500,
            position: 'bottom-right',
            class_name: a//gritter-center
        });
    }
</script>
{% endblock %}